<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                template="../templates/ui.xhtml">

    <ui:define name="content">
        <h1 class="title">Tree - Basic</h1>

        <div class="entry">
            <p>In it's simplest form, tree displays a server side model on client side.</p>

            <h:form>

                <p:tree value="#{treeBean.root}" var="node">
                    <p:treeNode>
                        <h:outputText value="#{node}"/>
                    </p:treeNode>
                </p:tree>

            </h:form>

            <h3>Source</h3>
            <p:tabView>
                <p:tab title="tree.xhtml">
                    <pre name="code" class="xml">
&lt;p:tree value="\#{treeBean.root}" var="node"&gt;
	&lt;p:treeNode&gt;
		&lt;h:outputText value="\#{node}"/&gt;
	&lt;/p:treeNode&gt;
&lt;/p:tree&gt;
                    </pre> 
                </p:tab>

                <p:tab title="TreeBean.java">
                    <pre name="code" class="java">
package org.primefaces.examples.view;

import org.primefaces.model.TreeNode;

public class TreeBean {
	
	private TreeNode root;

	public TreeBean() {
		root = new TreeNode("Root", null);
		TreeNode node0 = new TreeNode("Node 0", root);
		TreeNode node1 = new TreeNode("Node 1", root);
		TreeNode node2 = new TreeNode("Node 2", root);
		
		TreeNode node00 = new TreeNode("Node 0.0", node0);
		TreeNode node01 = new TreeNode("Node 0.1", node0);
		
		TreeNode node10 = new TreeNode("Node 1.0", node1);
		TreeNode node11 = new TreeNode("Node 1.1", node1);
		
		TreeNode node000 = new TreeNode("Node 0.0.0", node00);
		TreeNode node001 = new TreeNode("Node 0.0.1", node00);
		TreeNode node010 = new TreeNode("Node 0.1.0", node01);
		
		TreeNode node100 = new TreeNode("Node 1.0.0", node10);
	}

	public TreeNode getRoot() {
		return root;
	}
}
                    </pre>
                </p:tab>
            </p:tabView>
        </div>

    </ui:define>
</ui:composition>